<!doctype html>

<html lang="en">

  <head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">

    <title>北郡搬家司机账号绑定</title>

    <link rel="stylesheet" href="__LOGIN__/style.css">

    <link rel="stylesheet" href="__LOGIN__/iconfont.css">

    <script src="__LOGIN__/jquery.js"></script>

  </head>

  <style>

    .logo{

    	width: 100px;

    	height: 100px;

    	border-radius: 50%;

    	overflow: hidden;

    	margin: 0 auto;

    	margin-top: 50px;

    	border: 2px solid #aab564;

    }

    .logo .logoicon{

      width: 100%;

      border-radius: 50%;

    }

  </style>

  <body>

    <div class="login-box">

      <div class="logo">

        <img src="__LOGIN__/logo.jpg" class="logoicon">

      </div>

      <div class="box-con tran">

        <div class="login-con f-l">

          <div class="form-group">

            <input type="text" placeholder="真实姓名" class="name" maxlength="4" value=''/>

            <span class="error-notic">请输入司机真实姓名</span>

          </div>

          <div class="form-group">

            <input type="text" placeholder="手机号码" maxlength="11" class="mobile" value=""/>

            <span class="error-notic">手机号码格式不正确</span>

          </div>

          <div class="form-group">

            <button type="submit" class="tran pr">

              <a href="javascript:;" class="tran submit">绑定</a>

            </button>

          </div>

          <div class="from-line"></div>

        </div>

      </div>

    </div>

    <script>


      var _handle = ''; //储存电话是否填写正确
      var _handles = ''; //储存电话是否填写正确
      $(".submit").on("click", function() {
        var name = $('.name').val();
        var mobile = $('.mobile').val();
        verify.verifyName($('.name'))
        verify.verifyMobile($('.mobile'))
        // // post提交
        if (_handle && _handle) {  
          console.log('name', name, mobile);
          window.location.href="/Home/Index/login?name="+name+'&mobile='+mobile;
          // $.ajax({
          //   type: "GET",
          //   url: "{:U('Home/Index/login')}",
          //   data: {'name':name,'mobile':mobile},
          //   dataType: "json",
          //   success: function(data){
          //       console.log(data);
          //   }
          // })
        }
      });
      //表单验证
      function showNotic(_this) {
        $(_this).parents(".form-group").find(".error-notic").fadeIn(100);
        $(_this).focus();
      } //错误提示显示
      function hideNotic(_this) {
        $(_this).parents(".form-group").find(".error-notic").fadeOut(100);
      } //错误提示隐藏
      var verify = {
        verifyName: function(_this) {
          var _value = $(_this).val();
          if (_value.length == 0) {
            showNotic(_this);
            _handles = false;
          } else {
            hideNotic(_this);
            _handles = true;
          }
          return _handles
        }, //验证用户名
        verifyMobile: function(_this) {
          var validateReg = /^1[34578]\d{9}$/;
          var _value = $(_this).val();
          if (!validateReg.test(_value)) {
            showNotic(_this);
            _handle = false;
          } else {
            hideNotic(_this);
            _handle = true;
          }
          return _handle
        }, //验证手机号码
      }

    </script>

  </body>

</html>
